import { Timeline } from 'antd';
import './TimeLiner.sass';
import { getAllInfoApi } from '../../api/infoApi'
import { useEffect } from 'react';
import { useState } from 'react';

function Timeliner() {
    const [AllInfo, setAllInfo] = useState([]);
    useEffect(() => {
        getAllInfoApi().then((res) => {
            setAllInfo(res)
        })
    }, [])
    return (
        <Timeline className="time-line time-line-padding" pending="Recording...">
            {AllInfo.map((item) => {
                const dakaDay = item.dakaStart.split(" ")[0];
                console.log(dakaDay, "daka");
                return (
                    <Timeline.Item key={item.id}>
                        <p><span>打卡日期:{dakaDay}</span></p>
                        <p><span>开始时间:{item.dakaStart}</span></p>
                        <p><span>结束时间:{item.dakaEnd}</span></p>
                    </Timeline.Item>)
            })}
        </Timeline>
    )
}

export default Timeliner;